import { createRouter, createWebHistory } from 'vue-router'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    { path: '/', redirect: '/button' },
    { path: '/:pathMatch(.*)', redirect: '/button' },
    { path: '/button', name: 'button', component: () => import('@/views/button/button.vue') },
    { path: '/input', name: 'input', component: () => import('@/views/input/input.vue') },
    { path: '/loading', name: 'loading', component: () => import('@/views/loading/loading.vue') },
    { path: '/message', name: 'message', component: () => import('@/views/message/message.vue') },
    { path: '/modal', name: 'modal', component: () => import('@/views/modal/modal.vue') },
    { path: '/popup', name: 'popup', component: () => import('@/views/popup/popup.vue') },
    { path: '/tabs', name: 'tabs', component: () => import('@/views/tabs/tabs.vue') },
    { path: '/picker', name: 'picker', component: () => import('@/views/picker/picker.vue') },
    { path: '/countdown', name: 'countdown', component: () => import('@/views/countdown/countdown.vue') },
    { path: '/copy', name: 'copy', component: () => import('@/views/copy/copy.vue') },
    { path: '/step', name: 'step', component: () => import('@/views/step/step.vue') },
    { path: '/image', name: 'image', component: () => import('@/views/image/image.vue') },
    { path: '/more', name: 'more', component: () => import('@/views/more/more.vue') },
  ]
})

export default router
